<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <main>
        <!-- 视频 -->
        <div class="blackBox">
            <!-- 视频 -->
                <video src="../imgs/swiper1.jpg" class="videoBox" autoplay muted></video>
            <div class="numBox">
                <div class="mork">
                    <span class="numberator">1</span>/
                    <span class="denominator">4</span>
                </div>
                <p class="sportName">打架</p>
            </div>
        </div>
        <!-- 控制按钮和进度条 -->
        <div class="footBox">
            <div class="control">
                <div class="left">K</div>
                <div class="center">||</div>
                <div class="right">K</div>
            </div>
            <div class="progress"></div>
        </div>
    </main>
    <!-- 蒙层-->
    <div class="modal">
        <!-- 顶部文字 -->
        <div class="modalContent f16">放弃可以找到一万个理由，坚持只需要一个信念
        </div>
        <!-- 按钮及图片 -->
        <div class="modalBox">
            <!-- 按钮 -->
            <div class="madolButton">
                <div class="modalPlay">继续训练</div>
                <div class="modalEnd">结束训练</div>
            </div>1
            <!-- 图片及文字 -->
            <div class="pictureBox">
                <div class="imgBox">
                    <img src="../imgs/dog.jpg" class="imgLtself" alt="">
                </div>
                <!-- 文字 -->
                <div class="picturContent">嘿嘿嘿</div>
            </div>
        </div>
    </div>
</body>
</html>